import React from 'react';
import style from './AreaFilter.module.scss';

const AreaFilter = (props) => {
    const {id, symbol, inputValue } = props;
    console.log(id, symbol, inputValue);

    const inputChange = (val) => {
        console.log(val);
    };

    const selectChange = (val) => {
        console.log(val);
    };

    const remove = () => {
        console.log('remove');
    };

    <div className={style.areaFilter}>
        <Select defaultValue="lucy" style={{ width: 336 }} onChange={selectChange}>
            <Option value="jack">Jack</Option>
            <Option value="lucy">Lucy</Option>
            <Option value="disabled" disabled>
                Disabled
            </Option>
            <Option value="Yiminghe">yiminghe</Option>
        </Select>
        <Input placeholder="Basic usage" onChange={inputChange}/>
        <span className={style.removeIcon} onClick={remove}>
            <i className="iconfont icon-zoom-out"></i>
        </span>
    </div>
};

AreaFilter.displayName = 'AreaFilter';

AreaFilter.propTypes = {
    id: PropTypes.number,
    symbol: PropTypes.string,
    inputValue: PropTypes.number,
    viewport: PropTypes.object,
    onMapLoaded: PropTypes.func,
    layerGroup: PropTypes.object,
};

export default AreaFilter;